<template>
  <dv-full-screen-container1 style="height: 100%;">
    <div class="first-class-wrapper" style="display: flex; flex-direction: column; height: 100%;">
      <header>
        <div class="header-content">
          <h1 class="main-title" style="cursor: pointer;" @click="goHome">
            金融欺诈违规智能侦测平台画像子系统
          </h1>
        </div>
        <div class="time">{{ currentTime }}</div>
      </header>
      <div style="">
        <div style="padding-top: 20px;">
          <RouterView />
        </div>
      </div>
    </div>
  </dv-full-screen-container1>
</template>

<script lang="ts">
import { RouterLink } from 'vue-router'
import './style.css'
import dayjs from 'dayjs'
import 'dayjs/locale/zh-cn'
import weekOfYear from 'dayjs/plugin/weekOfYear'
import weekday from 'dayjs/plugin/weekday'
import logo from '@/assets/up-logo.png'

dayjs.extend(weekOfYear)
dayjs.extend(weekday)
dayjs.locale('zh-cn')
export default {
  data() {
    return {
      currentTime: '',
      interval: 0,
    }
  },
  mounted() {
    this.updateTime()
    this.interval = setInterval(this.updateTime, 1000)
  },
  beforeUnmount() {
    // 清除定时器，防止内存泄漏
    clearInterval(this.interval)
  },
  methods: {
    updateTime() {
      this.currentTime = dayjs().format('YYYY年 MM月 DD日 dddd HH:mm:ss')
    },
    goHome() {
      this.$router.push('/')
    }
  }
}

</script>

<style scoped>
.first-class-wrapper {
  /* background-image: url('/bg6.jpg');
  background-size: 100% 100%;
  box-shadow: 0 0 3px blue; */
}

header {
  color: white;
  text-align: center;
  /* flex: 0 0 80px; */
  height: 8%;
  position: relative;
}

.header-content {
  display: flex;
  flex-direction: column;
  height: 100%;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  /* margin-bottom: 20px; */
}

.main-title {
  background-image: -webkit-linear-gradient(top, rgb(217, 241, 241), rgb(172, 176, 188));
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 28px;
}

.time {
  position: absolute;
  right: 60px;
  bottom: 6%;
  font-size: 18px;
  background-image: -webkit-linear-gradient(top, rgb(217, 241, 241), rgb(172, 176, 188));
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: bold;
  line-height: 1em;
}
</style>
